<template>
  <el-row :gutter="20" :style='conTop' >
    <el-col :span="6" :offset="3" >
      <el-image :src="logo_url" style="width: 200px;height: 150px;"></el-image>
    </el-col>
    <el-col :span="6" :offset="4" >
      <div style="margin-top: 15px;width: 350px">
        <el-input placeholder="请输入内容" v-model="input20" class="input-with-select">
          <el-select v-model="select" slot="prepend" placeholder="请选择" style="width: 90px;">
            <el-option label="按职位" value="按职位"></el-option>
            <el-option label="按单位" value="按单位"></el-option>
          </el-select>
          <el-button slot="append" icon="el-icon-search" @click="doSearch"></el-button>
        </el-input>
      </div>
    </el-col>
  </el-row>
</template>

<script>
import  logo from './assets/logo2.png'
export default {
  name: "Logox",
  computed: {

  },
  data(){
    return {
      input20:"",
      select:'',
      conTop:{
        height:'150px',
        backgroundImage:'url(' + require('./assets/bg2.png') + ')',
        backgroundRepeat:'no-repeat',
        backgroundSize: 'cover',
        backgroundPosition: '80% 50%'
      },
      logo_url: logo
    }
  },
  methods:{
    doSearch(){
      this.$message("搜索查询:"+this.input20);
    },
    logo(){
      this.home_url = logo
    }
  }
}
</script>

<style scoped>
.el-select .el-input {
  width: 130px;
}
.input-with-select .el-input-group__prepend {
  background-color: #fff;
}
el-col{
  background: image("assets/bg.jpg") left top/100% no-repeat;
}
</style>